<template>
	<div class="page-wrap">
		<Table class='table' filter v-bind="tableOpts" v-on="tableEvent">
			<template #operator>
				<div class="operator-wrap">
					<modifyOut ref="outRef" @change="fetchCurrentTable" />
					<modifyInstall ref="installRef" @change="fetchCurrentTable" />
					<InstallList ref="installListRef" @change="fetchCurrentTable" />
					<!-- <ClassifyDetail ref="classifyDetailRef" @change="fetchCurrentTable" /> -->
					<ParseDetail ref="ParseDetailRef" @change="fetchCurrentTable" />
				</div>
			</template>
		</Table>
	</div>
</template>

<script>
import tableMixins from "@/mixins/tableMixins.vue";
import modifyOut from "./components/modifyOut.vue";
import modifyInstall from "./components/modifyInstall.vue";
import InstallList from "./InstallList.vue";
import ClassifyDetail from "./ClassifyDetail.vue";
import ParseDetail from "./components/ParseDetail.vue";
import dayjs from "dayjs";
export default {
	name: "OrderWarehouse",
	mixins: [tableMixins],
	components: {
		modifyOut,
		modifyInstall,
		InstallList,
		ClassifyDetail,
		ParseDetail,
	},
	data() {
		return {
			apiName: "orderList",
			form: {
				storeName: {
					tag: "el-input",
					label: "订单名称",
					value: "",
					props: {
						clearable: true,
						placeholder: "请输入订单名称",
					},
				},
				areaId: this.formArea(),
        creatorName: {
          tag: "el-input",
          label: "创建人名称",
          value: "",
          props: {
            clearable: true,
            placeholder: "请输入创建人名称",
          },
        },
				orderBy: {
					tag: "el-select",
					label: "排序规则",
					value: 1,
					items: [
						{ label: "默认排序", value: 1 },
						{ label: "发货日期", value: 2 },
						{ label: "修改时间", value: 3 },
					],
					props: {},
				},
				outStatus: {
					tag: "el-select",
					label: "出库状态",
					value: -1,
					items: [
						{ label: "全部", value: -1 },
						{ label: "待出库", value: 0 },
						{ label: "部分出库", value: 1 },
						{ label: "全部出库", value: 2 },
					],
					props: {},
				},
				orderType: {
					tag: "el-select",
					label: "订单类型",
					value: 1,
					items: [
						{ label: "新增店铺", value: 1 },
						{ label: "老店升级", value: 2 },
					],
					props: {},
				},
				startTime: {
					tag: "el-date-picker",
					label: "开始日期",
					value: "",
					props: {
						clearable: true,
						placeholder: "请选择开始日期",
						pickerOptions: {
							// disabledDate (time) {
							// 	return time.getTime() < dayjs().startOf("day").valueOf();
							// },
						},
					},
				},
				endTime: {
					tag: "el-date-picker",
					label: "结束日期",
					value: "",
					props: {
						clearable: true,
						placeholder: "请选择结束日期",
						pickerOptions: {
							// disabledDate (time) {
							// 	return time.getTime() < dayjs().startOf("day").valueOf();
							// },
						},
					},
				},
			},
		};
	},
	computed: {},
	methods: {
		handleAction(opts, row) {
			const { storeName: name, id } = row;
      console.log(row,opts)
			let ref = null;
			if (opts.includes("new")) {
				const map = {
					newOrderStorageList: "仓储货架清单",
					newOrderAdditionList: "杂项清单",
					newOrderMaterialList: "货架清单",
				};
				return this.$api[opts]({ id }).then((res) => {
					this.$quinn.exportExcel({
						data: res,
						sort: false,
						group: opts != "newOrderAdditionList",
						defaultTitle: `${map[opts]}-${name}`,
						productMap: window?.g_config?.productMap2 || {},
						productSort: window?.g_config?.productSort2 || [],
						productColumns: window?.g_config?.productColumns2 || {},
					});
				});
			} else if (opts == "delete")
				this.showConfirm(`确认删除【${name}】？`, "orderOrderDelete", {
					id,
					type: "warehouse",
				});
			else if (["storageDetail", "goodsDetail"].includes(opts)) {
				row.type = opts.replace("Detail", "");
				ref = this.$refs.ParseDetailRef;
				// classifyDetailRef;
			} else if (opts == "out") {
				ref = this.$refs.outRef;
			} else if (opts == "install") {
				ref = this.$refs.installRef;
			} else if (opts == "installList") {
				ref = this.$refs.installListRef;
			}

			ref && ref.showDialog(opts, row);
		},
		formatQuery(params) {
			try {
				// const d = dayjs(params.delivery);
				const s = dayjs(params.startTime);
				const e = dayjs(params.endTime);
				// if (d.isValid()) params.deliveryDate = d.format("YYYY-MM-DD");
				if (s.isValid()) params.startTime = s.format("YYYY-MM-DD");
				if (e.isValid()) params.endTime = e.format("YYYY-MM-DD");
				// const d = dayjs(params.delivery);
				// if (d.isValid()) params.deliveryDate = d.format("YYYY-MM-DD");
			} catch (e) {
				console.log(e);
			}
			if (params.outStatus == -1) delete params.outStatus;
			// params.type = "warehouse";
			params.type = 1
			return params;
		},
	},
};
</script>

<style lang="less" scoped>
.table /deep/ .el-image {
	//border: 4px solid #15f5d0;
	width: calc(100% + 8px);
	height: calc(100% + 8px);
	border-radius: 3px;
}
</style>
